<template lang="pug">
  el-input.main-search-input(:placeholder="placeholder" style="max-width: 500px;" :value="value" @input="$emit('input', $event)" ref="input" @keyup.native.13="$emit('search', $refs.input.$refs.input.value)")
    template(slot="append")
      i.el-input__icon.el-icon-search(@click="$emit('search', $refs.input.$refs.input.value)"  style="color:white")
</template>

<script>
export default {
  name: 'main-search-input',
  props: ['placeholder', 'value'],
  methods: {}
}
</script>

<style lang="scss">
  .main-search-input {
    input {
      border: 0px;

    }
    .el-icon-search {
      font-size: 19px;
    }
    .el-input-group__append {
      background: #00b1ff;
      border: 0px;
      width: 48px;
      box-sizing: border-box;
      padding-left: 4px;
      padding-right: 0px;
    }
    .el-icon-search {
      cursor: pointer;
    }
  }

</style>
